/*
 * @CreatDate: 2021-11-09 09:12:13
 * @Describe: 结果统计展示组件
 */

import './index.less';
import { Spin, Tooltip } from 'antd';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { Money } from '@lycd/com';
const { MoneyShow } = Money.set(1);

const Statistic = ({
  data = [],
  loading = false,
  title = '查询结果统计',
  isTitleBlock = false,
  style,
  className,
}) => {
  return (
    <div className={`lycd-statistic ${className}`} style={style}>
      <Spin spinning={loading}>
        {isTitleBlock ? <div>{title}</div> : title}
        {data?.map((item, index) => (
          <span
            className="s1"
            key={index}
            style={
              isTitleBlock && index === 0
                ? { margin: 0 }
                : title === '' && index === 0
                ? { margin: 0 }
                : {}
            }
          >
            {item.label}
            {item.labelTips ? (
              <Tooltip placement="top" title={item.labelTips}>
                <QuestionCircleOutlined style={{ marginLeft: 4 }} />
              </Tooltip>
            ) : (
              ''
            )}
            ：
            {item.type === 'money' ? (
              <b>
                {item.value || item.value === 0 ? (
                  <MoneyShow
                    value={item.value}
                    align="horizontal"
                    precision={2}
                    size="sm"
                    bold
                  />
                ) : (
                  '-'
                )}
              </b>
            ) : (
              <b>{item.value ?? '-'}</b>
            )}
          </span>
        ))}
      </Spin>
    </div>
  );
};

export default Statistic;
